<!-- myButton.vue -->
<template>
  <view class="contain">
    <image
      src="@/static/search/null.png"
      mode="scaleToFill"
      style="width: 150rpx; height: 150rpx; opacity: 0.5"
    />
    <br />
    <text style="font-size: 26rpx; color: #ac9dd4">{{ props.content }}</text>
    &nbsp;
    <navigator
      :url="props.url"
      open-type="navigate"
      hover-class="navigator-hover"
      style="display: inline-block"
    >
      <a href="#" style="font-size: 33rpx; color: #ac9dd4; text-decoration: underline">
        {{ props.href }}
      </a>
    </navigator>
  </view>
</template>

<script setup lang="ts">
const props = defineProps<{
  content: string
  href: string
  url: string
}>()
</script>

<style scoped>
.contain {
  padding: 10px 20px;
  text-align: center;
}
</style>
